﻿window.onload = function () {
    var colors = [
          'red',
          'orange',
          'yellow',
          'green',
          'blue',
          'violet'
        ],
        length = colors.length,
        i,
        body = document.getElementsByTagName('body')[0],
        color,
        widget;

    for (i = 0; i < length; ++i) {
        color = colors[i];

        widget = document.createElement('div');
        widget.className = color + ' wjs-panel';

        widget.innerHTML = '<div class="wjs-header">Header</div>' +
                            '<div class="wjs-body">' +
                                'Body' +
                                '<div class="wjs-selected">Selected</div>' +
                                '<div class="wjs-highlighted">Highlighted</div>' +
                            '<div class="wjs-footer">Footer</div>';
                               
        body.appendChild(widget);

        body.appendChild(document.createElement('br'));
    }

};